﻿<link href="~/Scripts/jquery-easyui-extensions/window/jeasyui.extensions.window.css" rel="stylesheet" />

<div class="easyui-panel" data-options="fit:true">
    <div id="w1" class="easyui-window" data-options="title:'hcenter、vcenter 为 true 的窗口',closed:false,hcenter:true,vcenter:true" style="height: 250px; width: 280px; padding: 5px;">
        我是一个“自动调节成水平居中并垂直居中”的 easyui-window。
        <br /><br />
        <span style="color:red;">本页面初始化时并未载入 autoCenter 的扩展脚本，所以此时当浏览器尺寸被调整时，easyui-window 并不会自动修正位置。</span>

        <br /><br />
        <a id="btnAppendExtJs" class="easyui-linkbutton" data-options="iconCls:'icon-add'">向本页面中载入扩展js</a>
        <br />
        <span style="color:red;" id="msg"></span>
        <br /><br />
        <a id="btnOpenNew" class="easyui-linkbutton" data-options="iconCls:'icon-add'">在新的浏览器标签打开本扩展演示</a>
    </div>
</div>

<script>
    $(function () {

        var reloadOnce = $.string.toBoolean("@ViewBag.ReloadOnce");

        var checkExtJs = function () {
            var topHead = $("head"),
                existHeadContent = topHead.html(),
                exist = $.string.contains(existHeadContent, "jeasyui.extensions.window.autoCenter.js");

            return exist;
        };

        $("#btnAppendExtJs").click(function () {
            if (checkExtJs()) {
                alert("已经添加 autoCenter 扩展的引用，无需重复添加。");
            } else {
                var jsUrl = ["/Scripts/jquery-easyui-extensions/window/jeasyui.extensions.window.autoCenter.js"];
                $.util.loadJs(jsUrl);
                alert("autoCenter 扩展的引用添加成功。");
                $("#msg").html("autoCenter 扩展的引用添加成功。再去调整浏览器尺寸试试。");
            }
        });

        $("#btnOpenNew").click(function () {

            window.open("/Window/AutoCenterDemo?reloadOnce=true");

        });
        if (reloadOnce) {
            console.log(reloadOnce);
            window.location.href = "/Window/AutoCenterDemo?reloadOnce=false";
        }
    });
</script>